<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <%@include file="/WEB-INF/jspf/meta/meta.jspf" %>
    <title>Title</title>
    <%@include file="/WEB-INF/jspf/adminPage.jspf" %>
    <script type="text/javascript" src="<%=request.getContextPath()%>/static/sysPowerStudent/sysPowerStudent.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/static/_framework/jquery/jquery.serializejson.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/static/_framework/jquery/date.js"></script>

</head>

<script>
    $(function () {
        $('#grid').datagrid({
            url : path_home+'/student/selectList',
            striped : true,//隔行换色
            pagination : true,//分页工具栏
            pagePosition : 'bottom',
            singleSelect:true,
            pageSize : 10,
            fitColumns:true,
            fit:true,
            pageNumber : 1,
            pageList : [ 10,20 ],
            columns : [[
                {field : 'studentId',title: '学生编号',align : 'center',sortable:true,checkbox:true},
                {field : 'studentName',title: '学生姓名',align : 'center',sortable:true},
                {field : 'studentEmail',title: '邮箱',width: '200px',align : 'center',sortable:true},
            ]],//表格字段
            onSelect:function (index,row) {
                $("#roleTree").tree({
                    url:path_home+'/sysRole/getRoleByStudentId?id='+row.studentId
                })
                // $("#roleTree").tree('reload')

                $("#powerTree").tree({
                    url:path_home+'/sysPower/getPowerByStudentId?id='+row.studentId
                })
                // $("#powerTree").tree('reload')
            }
        });
        $("#roleTree").tree(
            {
                url:path_home+'/sysRole/getRoleByStudentId?id=0',
                animate:true,
                checkbox:true,
                onDblClick : function(node) {
                    // 展开/折叠
                    if (node.state === 'open') {
                        $('#roleTree').tree('collapse', node.target);
                    } else {
                        $('#roleTree').tree('expand', node.target);
                    }
                }
            }
        );

        $("#powerTree").tree(
            {
                url:path_home+'/sysPower/findAllPower?type=0',
                animate:true,
                checkbox:true,
                onDblClick : function(node) {
                    // 展开/折叠
                    if (node.state === 'open') {
                        $('#powerTree').tree('collapse', node.target);
                    } else {
                        $('#powerTree').tree('expand', node.target);
                    }
                }
            }
        );
    })

    function saveRoles() {
        let row = $('#grid').treegrid('getSelected');
        if (row){
            let id = row.studentId;
            let nodes = $('#roleTree').tree('getChecked');	// get checked nodes
            let ids = nodes.map(node=>node.id).join(",");
            $.ajax({
                url:path_home+'/sysRole/updateStudentRole',
                data:{id: id,ids:ids},
                type:'post',
                dataType:'json',
                success:function(data){
                    $.messager.show({
                        title:'提示',
                        msg:data.msg,
                        timeout:3000,
                        showType:'slide'
                    });
                    if(data.code>0){
                        //重新加载表单
                        // $('#roleTree').tree('reload');
                    }
                }
            })
        }else{
            $.messager.alert("提示","请选择学生","info")
        }
    }

    function savePowers() {
        let row = $('#grid').treegrid('getSelected');
        if (row){
            let id = row.studentId;
            let nodes = $('#powerTree').tree('getChecked');	// get checked nodes
            let ids = nodes.map(node=>node.id).join(",");
            $.ajax({
                url:path_home+'/sysPower/updateStudentPower',
                data:{id: id,ids:ids},
                type:'post',
                dataType:'json',
                success:function(data){
                    $.messager.show({
                        title:'提示',
                        msg:data.msg,
                        timeout:3000,
                        showType:'slide'
                    });
                    if(data.code>0){
                        //重新加载表单
                        // $('#powerTree').tree('reload');
                    }
                }
            })
        }else{
            $.messager.alert("提示","请选择学生","info")
        }
    }
</script>
<body class="easyui-layout">


<div data-options="region:'west',title:'学生列表',split:true" style="padding:5px;width: 20%;">
     <table id="grid"></table>
</div>

<div data-options="region:'center',title:'设置角色'"  style="padding:5px;width: 40%">
    <div style="position: fixed;right:41%;top: 5%; ">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="saveRoles()">保存</a>
    </div>
    <ul  id="roleTree">
    </ul>
</div>

<div data-options="region:'east',title:'直接权限',split:true" style="padding:5px;width: 40%;">
    <div style="position: fixed; right: 2%; top: 5%; ">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="savePowers()">保存</a>
    </div>
    <ul  id="powerTree">
    </ul>
</div>
</body>

</html>